<template>
    <div>
        <el-form ref="formRef" label-width="auto">
            <el-form-item label="SKU名称">
                <el-input placeholder="请输入SKU名称" />
            </el-form-item>

            <el-form-item label="价格(元)">
                <el-input placeholder="价格(元)" type="number" />
            </el-form-item>

            <el-form-item label="重量(g)">
                <el-input placeholder="重量(g)" type="number" />
            </el-form-item>

            <el-form-item label="SKU描述">
                <el-input placeholder="SKU描述" type="textarea" />
            </el-form-item>

            <el-form-item label="平台属性">
                <el-form ref="formRef" :inline="true">
                    <el-form-item label="手机一级" class="select-form-item">
                        <el-select placeholder="请选择">
                            <el-option label="edd" />
                        </el-select>
                    </el-form-item>

                    <el-form-item label="电池容量" class="select-form-item">
                        <el-select placeholder="请选择">
                            <el-option label="edd" />
                        </el-select>
                    </el-form-item>

                    <el-form-item label="运行内存" class="select-form-item">
                        <el-select placeholder="请选择">
                            <el-option label="edd" />
                        </el-select>
                    </el-form-item>

                    <el-form-item label="机身内存" class="select-form-item">
                        <el-select placeholder="请选择">
                            <el-option label="edd" />
                        </el-select>
                    </el-form-item>

                    <el-form-item label="CPU型号" class="select-form-item">
                        <el-select placeholder="请选择">
                            <el-option label="edd" />
                        </el-select>
                    </el-form-item>

                    <el-form-item label="屏幕尺寸" class="select-form-item">
                        <el-select placeholder="请选择">
                            <el-option label="edd" />
                        </el-select>
                    </el-form-item>
                </el-form>

            </el-form-item>

            <el-form-item label="销售属性">
                <el-form ref="formRef" :inline="true">
                    <el-form-item label="颜色" class="select-form-item">
                        <el-select placeholder="请选择">
                            <el-option label="edd" />
                        </el-select>
                    </el-form-item>
                </el-form>
            </el-form-item>

            <el-form-item label="图片名称">
                <el-table border style="width: 100%" :data="[1, 2]">
                    <el-table-column width="80px" type="selection" align="center" />
                    <el-table-column label="图片" />
                    <el-table-column label="名称" />
                    <el-table-column label="操作"> </el-table-column>
                </el-table>

            </el-form-item>

            <el-form-item label=" ">
                <el-button type='primary' size="default">保存</el-button>
                <el-button size="default" @click="cancel">取消</el-button>
            </el-form-item>

        </el-form>
    </div>
</template>

<script setup lang='ts' name='SkuForm'>
let $emit = defineEmits(['changeScene']);

const cancel = () => {
    $emit('changeScene', 0);
}

// 初始化数据
const initData = () => {
    console.log("xxxxxxxxxxxx");
}

defineExpose({
    initData
})

</script>

<style scoped lang='scss'>
.select-form-item {
    width: 350px;
    margin-bottom: 20px;
}
</style>